class NotepadHelp extends HTMLElement {
    constructor() {
        super();
        this.template = document.createElement("template");
        this.template.innerHTML = this.#html;
        this.appendChild(this.template.content);

        this.querySelector(".close").addEventListener("click",()=> {
            this.querySelector(".notepadhelp").style.display="none";
        });
        
        this.querySelector(".confirm").addEventListener("click",()=> {
            this.querySelector(".notepadhelp").style.display="none";
        });
        
    }
    #html = `
    <div class="notepadhelp">
        <div class="helpbox">
            <div class="toptable">
                <p>关于“记事本”</p>
                <span class="close">✖</span>
            </div>
            <div class="content">
                <h1 class="title">JSNotepad</h1>
                <hr class="line">
                <img class="logo" src="./notepad-icon-32.png">
                <div class="message">
                    <p class="message1">作者：李雨雷</p>
                    <p class="message1">QQ：2583951693</p>
                    <p class="message1">仓库地址：<a href="https://gitee.com/super-love/notepad"  class="message2" target="_blank">https://gitee.com/super-love/notepad</a></p>
                </div>
                <input class="confirm" type="button" value="确定">
            </div>
        </div>
    </div>
      `;
  }
  customElements.define("notepad-help", NotepadHelp);
  